<template>
    <div class="page_1">
        <div class="top_box">
            <!-- <el-cascader style="width:200px;margin-left:10px" ref="cascader" v-model="admin_id" :props="props" clearable
                placeholder="请选择管理中心/路段"></el-cascader> -->
            <el-select v-model="admin_id" placeholder="请选择管理中心" style="margin-left:10px">
                <el-option v-for="item in managementCenter" :key="item.id" :label="item.nickname" :value="item.id">
                </el-option>
            </el-select>
            <el-button type="warning" style="margin-left:20px" icon="el-icon-search" size="small" @click="getInfo">搜索</el-button>
            <el-button style="margin-left:20px" size="small" @click="reset" type="primary">重置</el-button>
            <el-button type="primary" style="margin-left:20px" icon="el-icon-upload" size="small " @click="leadingOut">导出</el-button>
        </div>
        <el-table :data="data" style="width: 100%" border>
            <el-table-column prop="road_name" label="路段名称">
            </el-table-column>
            <el-table-column prop="nickname" label="管理中心">
            </el-table-column>
            <el-table-column prop="rt_num" label="认同工单">
            </el-table-column>
            <el-table-column prop="yb_num" label="一般工单">
            </el-table-column>
            <el-table-column prop="brt_num" label="不认同工单">
            </el-table-column>
            <el-table-column prop="num" label="工单总数">
            </el-table-column>
        </el-table>
        <el-pagination class="main-pagination" :total="total" :current-page.sync="page" :page-size="limit" layout="prev, pager, next, jumper,total" @current-change="getInfo" hide-on-single-page></el-pagination>
    </div>
</template>

<script>
import { post } from "@/assets/js/http.js"
import queryString from "qs"
export default {
    data() {
        return {
            total: 0,
            limit: 20,
            page: 1,
            data: [],
            admin_id: "",
            managementCenter: [],
            // props: {
            //     label: "nickname",
            //     value: "id",
            //     lazy: true,
            //     async lazyLoad(node, resolve) {
            //         const { level, value } = node;
            //         if (level === 0) {
            //             const result = await post({
            //                 url: "/admin/answer.Subject/admin_list",
            //                 data: {}
            //             });
            //             console.log(result, 'result')
            //             resolve(result);
            //         } else if (level === 1) {
            //             const result = await post({
            //                 url: "/admin/answer.Road/index",
            //                 data: {
            //                     admin_id: value,
            //                     limit: 50,
            //                 }
            //             });

            //             result.data.forEach((item) => {
            //                 item.leaf = true
            //                 item.nickname = item.road_name
            //             });
            //             console.log(result)
            //             resolve(result.data);
            //         }
            //     },
            // },
        }
    },
    methods: {
        getInfo(index = 1) {
            post({
                url: "/admin/answer.Subject/road_work_census",
                data: {
                    page: index,
                    limit: this.limit,
                    admin_id: this.admin_id
                    // road_id: this.admin_id[1] || '',
                },
                loading: true
            }).then(res => {
                console.log(res);
                this.data = res.data
                this.total = res.total
                this.page = res.current_page
            })
        },
        // 获取管理中心列表
        getManagementCenter() {
            post({
                url: "/admin/answer.Subject/admin_list"
            }).then(res => {
                this.managementCenter = res
            })
        },
        reset() {
            this.admin_id = ""
            this.getInfo()

        },
        leadingOut() {
            open("http://nhcj.app65.cn/api/realmerit/road_work_export?" + queryString.stringify({
                admin_id: this.admin_id
                // road_id: this.admin_id[1] || '',
            }))
        },
    },
    mounted() {
        this.getInfo()
        this.getManagementCenter()
    }
}
</script>

<style lang="scss" scoped></style>